<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>全域旅游企业监测应急指挥平台</title>
    <link rel="icon" type="image/x-icon" href="../../images/logo.png">
    <link rel="stylesheet" href="../../plugin/M_select/js/M_select/M_select.css">
    <link rel="stylesheet" href="../../css/reset.css">
    <link rel="stylesheet" href="../../css/common.css">
    <link rel="stylesheet" href="../../css/brand.css">
</head>

<body>
    <div class="box">
        <!-- 头部 -->
        <div class="header-box">
                <img src="../../images/headeBg.png" alt="">
                <div class="weather-box">
                    <span>郑州 小雨转多云 32/16℃</span>
                </div>
                <h1 class="header-title"><img src="../../images/header.png" alt=""></h1>
                <div class="header-action">
                    <span class="action-time"></span>
                    <a href="javascript:;">管理中心</a>
                    <a href="javascript:;">退出</a>
                </div>
            </div>
        <div class="main-box">
            <!-- 侧边导航 -->
            <ul class="aside-box">
                <li>
                    <a href="../home.html">
                        <span>
                            <img class="aside-img" src="../../images/home.png" alt="">
                            <img class="aside-imgA " src="../../images/homeA.png" alt="">
                            首页
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../surroundings/development.html">
                        <span>
                            <img class="aside-img" src="../../images/huanjing.png" alt="">
                            <img class="aside-imgA" src="../../images/huanjingA.png" alt="">
                            产业发展环境
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../basic/basic.html">
                        <span>
                            <img class="aside-img" src="../../images/yaosu.png" alt="">
                            <img class="aside-imgA" src="../../images/yaosuA.png" alt="">
                            产业基础要素
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../passengerFlow/destination.html">
                        <span>
                            <img class="aside-img" src="../../images/keliu.png" alt="">
                            <img class="aside-imgA" src="../../images/keliuA.png" alt="">
                            旅游客流监测
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../productTesting/index.html">
                        <span>
                            <img class="aside-img" src="../../images/chanpin.png" alt="">
                            <img class="aside-imgA" src="../../images/chanpinA.png" alt="">
                            旅游产品监测
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../enterprise/scenicMonitor.html">
                        <span>
                            <img class="aside-img" src="../../images/qiye.png" alt="">
                            <img class="aside-imgA" src="../../images/qiyeA.png" alt="">
                            旅游企业监测
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../tourismProject/index.html">
                        <span>
                            <img class="aside-img" src="../../images/xiangmu.png" alt="">
                            <img class="aside-imgA" src="../../images/xiangmuA.png" alt="">
                            旅游项目监测
                        </span>
                    </a>
                </li>
                <li class="active">
                    <a href="./brand.html">
                        <span>
                            <img class="aside-img" src="../../images/pinpai.png" alt="">
                            <img class="aside-imgA" src="../../images/pinpaiA.png" alt="">
                            旅游品牌监测
                        </span>
                    </a>
                </li>
            </ul>
            <!-- 主题内容 -->
            <div class="content-box">
                <div class="top-box">
                    <div>
                        <div class="title-box">
                            <h3>
                                <img src="../../images/titile-img.png" alt="">
                                旅游品牌监测
                            </h3>
                        </div>
                        <div class="selected">
                            <div class="select-box">
                                <select name="" id="select-sheng" class="sheng">
                                    <option value="">河南省</option>
                                    <option value="">湖南省</option>
                                    <option value="">四川省</option>
                                </select>
                            </div>
                            <div class="select-box">
                                <select name="" id="select-shi" class="shi">
                                    <option value="">郑州市</option>
                                    <option value="">焦作市</option>
                                    <option value="">洛阳市</option>
                                </select>
                            </div>
                        </div>
                        <div class="list-box">
                            <div>
                                <div class="active">
                                    <img class="brand-image" src="../../images/brand-scenic.png" alt="">
                                    <img class="brand-imageA" src="../../images/brand-scenicA.png" alt="">
                                    <span>景区</span>
                                </div>
                                <div>
                                    <img class="brand-image" src="../../images/brand-hotel.png" alt="">
                                    <img class="brand-imageA" src="../../images/brand-hotelA.png" alt="">
                                    <span>星级酒店</span>
                                </div>
                            </div>
                            <div>
                                <div>
                                    <img class="brand-image" src="../../images/brand-canyin.png" alt="">
                                    <img class="brand-imageA" src="../../images/brand-canyinA.png" alt="">
                                    <span>餐饮</span>
                                </div>
                                <div>
                                    <img class="brand-image" src="../../images/brand-yule.png" alt="">
                                    <img class="brand-imageA" src="../../images/brand-yuleA.png" alt="">
                                    <span>休闲娱乐</span>
                                </div>
                            </div>
                            <div>
                                <div>
                                    <img class="brand-image" src="../../images/brand-shopping.png" alt="">
                                    <img class="brand-imageA" src="../../images/brand-shoppingA.png" alt="">
                                    <span>购物场所</span>
                                </div>
                                <div>
                                    <img class="brand-image" src="../../images/brand-lvxs.png" alt="">
                                    <img class="brand-imageA" src="../../images/brand-lvxsA.png" alt="">
                                    <span>旅行社</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div>
                        <div class="title-box">
                            <h3>
                                <img src="../../images/titile-img.png" alt="">
                                旅游品牌信息动态监测
                            </h3>
                        </div>
                        <ul class="table-box scrollbar"">

                            <li class=" Thead">
                            <span>动态信息</span>
                            <span>时间</span>
                            <span>来源</span>
                            <span>评论</span>
                            <span>转发</span>
                            <span>点赞</span>
                            <span>观点</span>
                            </li>

                            <li class="Tbody">
                                <div>【少林寺】焦作中旅银行，总冠名2019第六届嵩山
                                    少林国际马拉松赛</div>
                                <div>08-12 12:23</div>
                                <div>微信</div>
                                <div>1286</div>
                                <div>2568</div>
                                <div>18968</div>
                                <div>正面</div>
                            </li>
                            <li class="Tbody">
                                <div>【清明上河园】重阳节：开封清明上河园一日游88
                                    元，仅限10月7日1天！</div>
                                <div>08-12 12:23</div>
                                <div>网易</div>
                                <div>1286</div>
                                <div>2568</div>
                                <div>18968</div>
                                <div>正面</div>
                            </li>
                            <li class="Tbody">
                                <div class="active">【龙门石窟】开启“高颜值”模式的龙门石窟膨胀
                                    了？票价上涨那么多。</div>
                                <div>08-12 12:23</div>
                                <div>微信公众号</div>
                                <div>1286</div>
                                <div>2568</div>
                                <div>18968</div>
                                <div class="active">负面</div>
                            </li>
                            <li class="Tbody">
                                <div>【嵖岈山】金秋十月，1300多万支郁金香绽放，可
                                    以欣赏到郁金花绽放的浪漫风景。</div>
                                <div>08-12 12:23</div>
                                <div>新浪微博</div>
                                <div>1286</div>
                                <div>2568</div>
                                <div>18968</div>
                                <div>正面</div>
                            </li>
                            <li class="Tbody">
                                <div class="active">
                                    【老君山】老君山还能走多远，高门票，低体验，
                                    怎能吸引游客
                                </div>
                                <div>08-12 12:23</div>
                                <div>新浪微博</div>
                                <div>1286</div>
                                <div>2568</div>
                                <div>18968</div>
                                <div class="active">负面</div>
                            </li>
                            <li class="Tbody">
                                <div>【少林寺】焦作中旅银行，总冠名2019第六届嵩山
                                    少林国际马拉松赛</div>
                                <div>08-12 12:23</div>
                                <div>新浪微博</div>
                                <div>1286</div>
                                <div>2568</div>
                                <div>18968</div>
                                <div>正面</div>
                            </li>
                            <li class="Tbody">
                                <div>【嵖岈山】金秋十月，1300多万支郁金香绽放，可
                                    以欣赏到郁金花绽放的浪漫风景。</div>
                                <div>08-12 12:23</div>
                                <div>新浪微博</div>
                                <div>1286</div>
                                <div>2568</div>
                                <div>18968</div>
                                <div>正面</div>
                            </li>
                            <li class="Tbody">
                                <div class="active">
                                    【老君山】老君山还能走多远，高门票，低体验，
                                    怎能吸引游客
                                </div>
                                <div>08-12 12:23</div>
                                <div>新浪微博</div>
                                <div>1286</div>
                                <div>2568</div>
                                <div>18968</div>
                                <div class="active">负面</div>
                            </li>
                            <li class="Tbody">
                                <div>【少林寺】焦作中旅银行，总冠名2019第六届嵩山
                                    少林国际马拉松赛</div>
                                <div>08-12 12:23</div>
                                <div>新浪微博</div>
                                <div>1286</div>
                                <div>2568</div>
                                <div>18968</div>
                                <div>正面</div>
                            </li>
                        </ul>
                    </div>
                    <div>
                        <div class="title-box">
                            <h3>
                                <img src="../../images/titile-img.png" alt="">
                                12301投诉
                            </h3>
                        </div>
                        <ul class="scrollbar">
                            <li>
                                <p>【少林寺】出租车行业为什么“涛声依旧”。</p>
                                <div><span>10-15 15:25</span><i class="red">待处理</i></div>
                            </li>
                            <li>
                                <p>【【云台山】厕所太少，分布合理。</p>
                                <div><span>10-15 15:25</span><i class="red">待处理</i></div>
                            </li>
                            <li>
                                <p>【云台山】人太多了！公交车辆安排不合理，进不去出不来！</p>
                                <div><span>10-15 15:25</span><i class="red">待处理</i></div>
                            </li>
                            <li>
                                <p>【清明上河园】没有解说，节目衔接不紧凑。</p>
                                <div><span>10-15 15:25</span><i class="blue">已处理</i></div>
                            </li>
                            <li>
                                <p>【龙门石窟】垃圾票价，两张票比现场贵50</p>
                                <div><span>10-15 15:25</span><i class="blue">已处理</i></div>
                            </li>
                            <li>
                                <p>【云台山】票价太高，饭菜太贵</p>
                                <div><span>10-15 15:25</span><i class="blue">已处理</i></div>
                            </li>
                            <li>
                                <p>【龙门石窟】垃圾票价，两张票比现场贵50</p>
                                <div><span>10-15 15:25</span><i class="blue">已处理</i></div>
                            </li>
                            <li>
                                <p>【云台山】票价太高，饭菜太贵</p>
                                <div><span>10-15 15:25</span><i class="blue">已处理</i></div>
                            </li>
                            <li>
                                <p>【云台山】票价太高，饭菜太贵</p>
                                <div><span>10-15 15:25</span><i class="blue">已处理</i></div>
                            </li>
                            <li>
                                <p>【龙门石窟】垃圾票价，两张票比现场贵50</p>
                                <div><span>10-15 15:25</span><i class="blue">已处理</i></div>
                            </li>
                            <li>
                                <p>【云台山】票价太高，饭菜太贵</p>
                                <div><span>10-15 15:25</span><i class="blue">已处理</i></div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="bottom-box">
                    <div>
                        <div class="title-box">
                            <h3>
                                <img src="../../images/titile-img.png" alt="">
                                品牌口碑红黑榜
                            </h3>
                        </div>
                        <div class="red-black-box">
                            <div>
                                <h3>红榜<i>TOP10</i></h3>
                                <p><em>1</em><span>云台山</span></p>
                                <p><em>2</em><span>少林寺</span></p>
                                <p><em>3</em><span>清明上河园</span></p>
                                <p><em>4</em><span>龙门石窟</span></p>
                                <p><em>5</em><span>白云山</span></p>
                                <p><em>6</em><span>云台山</span></p>
                                <p><em>7</em><span>少林寺</span></p>
                                <p><em>8</em><span>清明上河园</span></p>
                                <p><em>9</em><span>龙门石窟</span></p>
                                <p><em>10</em><span>白云山</span></p>
                            </div>
                            <div>
                                <h3>黑榜<i>TOP10</i></h3>
                                <p><em>1</em><span>石人山</span></p>
                                <p><em>2</em><span>丹江水库</span></p>
                                <p><em>3</em><span>伏牛山</span></p>
                                <p><em>4</em><span>黄河风景名胜区</span></p>
                                <p><em>5</em><span>鸡公山</span></p>
                                <p><em>6</em><span>石人山</span></p>
                                <p><em>7</em><span>丹江水库</span></p>
                                <p><em>8</em><span>伏牛山</span></p>
                                <p><em>9</em><span>黄河风景名胜区</span></p>
                                <p><em>10</em><span>鸡公山</span></p>
                            </div>
                        </div>
                    </div>
                    <div>
                        <div class="title-box">
                            <h3>
                                <img src="../../images/titile-img.png" alt="">
                                假日评论
                            </h3>
                        </div>
                        <div class="holiday-header">
                            <div class="left">
                                <a href="javascript:;">元旦</a>
                                <a href="javascript:;">春节</a>
                                <a href="javascript:;">清明</a>
                                <a href="javascript:;">端午</a>
                                <a href="javascript:;">劳动</a>
                                <a href="javascript:;">中秋</a>
                                <a class="active" 　href="javascript:;">国庆</a>
                            </div>
                            <div class="right">
                                <span>评价来源:</span>
                                <div class="selected">
                                    <div class="select-box">
                                        <select name="" id="select-sheng" class="sheng">
                                            <option value="">河南省</option>
                                            <option value="">湖南省</option>
                                            <option value="">四川省</option>
                                        </select>
                                    </div>
                                    <div class="select-box">
                                        <select name="" id="select-shi" class="shi">
                                            <option value="">郑州市</option>
                                            <option value="">焦作市</option>
                                            <option value="">洛阳市</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <ul class="scrollbar">
                            <li>
                                <div>
                                    <h3>【嵖岈山】金秋十月，1300多万支郁金香绽放，景色十分优美。</h3>
                                    <p>
                                        <span class="blue">2019-10-06&nbsp;&nbsp;&nbsp;&nbsp; 10:56</span>
                                        <span class="yellow">大众点评</span>
                                        <span>回复：<i>50</i></span>
                                        <span>点赞：<i>100</i></span>
                                    </p>
                                </div>
                                <a href="javascript:;">好评</a>
                            </li>
                            <li>
                                <div>
                                    <h3>【清明上河园】人实在太多了，国庆，人挤人，观园不是太好。</h3>
                                    <p>
                                            <span class="blue">2019-10-06&nbsp;&nbsp;&nbsp;&nbsp; 10:56</span>
                                            <span class="yellow">大众点评</span>
                                            <span>回复：<i>50</i></span>
                                            <span>点赞：<i>100</i></span>
                                        </p>
                                </div>
                                <a href="javascript:;" class="good">中评</a>
                            </li>
                            <li>
                                <div>
                                    <h3>【龙门石窟】级别是不错的，就是门票有点贵，导游讲的不错。</h3>
                                    <p>
                                            <span class="blue">2019-10-06&nbsp;&nbsp;&nbsp;&nbsp; 10:56</span>
                                            <span class="yellow">大众点评</span>
                                            <span>回复：<i>50</i></span>
                                            <span>点赞：<i>100</i></span>
                                        </p>
                                </div>
                                <a href="javascript:;">好评</a>
                            </li>
                            <li>
                                <div>
                                    <h3>【云台山】索道维修了，没有任何说明，走上山，走下山。</h3>
                                    <p>
                                            <span class="blue">2019-10-06&nbsp;&nbsp;&nbsp;&nbsp; 10:56</span>
                                            <span class="yellow">大众点评</span>
                                            <span>回复：<i>50</i></span>
                                            <span>点赞：<i>100</i></span>
                                        </p>
                                </div>
                                <a href="javascript:;" class="bad">差评</a>
                            </li>
                            <li>
                                <div>
                                    <h3>【少林寺】导游讲解的不错，景色还行，就是假期人有点多。</h3>
                                    <p>
                                            <span class="blue">2019-10-06&nbsp;&nbsp;&nbsp;&nbsp; 10:56</span>
                                            <span class="yellow">大众点评</span>
                                            <span>回复：<i>50</i></span>
                                            <span>点赞：<i>100</i></span>
                                        </p>
                                </div>
                                <a href="javascript:;">好评</a>
                            </li>
                            <li>
                                <div>
                                    <h3>【少林寺】导游讲解的不错，景色还行，就是假期人有点多。</h3>
                                    <p>
                                            <span class="blue">2019-10-06&nbsp;&nbsp;&nbsp;&nbsp; 10:56</span>
                                            <span class="yellow">大众点评</span>
                                            <span>回复：<i>50</i></span>
                                            <span>点赞：<i>100</i></span>
                                        </p>
                                </div>
                                <a href="javascript:;">好评</a>
                            </li>
                            <li>
                                <div>
                                    <h3>【少林寺】导游讲解的不错，景色还行，就是假期人有点多。</h3>
                                    <p>
                                            <span class="blue">2019-10-06&nbsp;&nbsp;&nbsp;&nbsp; 10:56</span>
                                            <span class="yellow">大众点评</span>
                                            <span>回复：<i>50</i></span>
                                            <span>点赞：<i>100</i></span>
                                        </p>
                                </div>
                                <a href="javascript:;">好评</a>
                            </li>
                        </ul>
                    </div>
                    <div>
                        <div class="title-box">
                            <h3>
                                <img src="../../images/titile-img.png" alt="">
                                游客满意度
                            </h3>
                        </div>
                        <div class="chart-box" id="chart6-1"></div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <script src="../../plugin/jquery-1.11.1.min.js"></script>
    <script src="../../plugin/ECharts/echarts.js"></script>
    <script src="../../plugin/ECharts/china.js"></script>
    <script src="../../plugin/M_select/js/M_select/M_select.js"></script>
    <script src="../../js/common.js"></script>
    <!-- <script src="../../js/home.js"></script> -->
    <script>
        $(".sheng").M_select({
            // 手动添加下拉款图片（以html页面为起始位置写路径）
            "Img": "../../plugin/M_select/js/M_select/up4.png",
            "Img2": "../../plugin/M_select/js/M_select/down4.png",
            "radius": "4px",
            "Title": "选择省",
            "inputName": "selected_value",
            // 默认选中的值（参数值写需要选中的select的value值）
            "selected": "03",
            Succee: function () {
                site = $('#select-sheng').val()
                console.log(site)
            }
        });
        $(".shi").M_select({
            // 手动添加下拉款图片（以html页面为起始位置写路径）
            "Img": "../../plugin/M_select/js/M_select/up4.png",
            "Img2": "../../plugin/M_select/js/M_select/down4.png",
            "radius": "4px",
            "Title": "选择市",
            "inputName": "selected_value",
            // 默认选中的值（参数值写需要选中的select的value值）
            "selected": "03",
            Succee: function () {
                site = $('#select-shi').val()
                console.log(site)
            }


        });
        $('.top-box>div:eq(0)').find('.list-box>div>div').click(function(){
            console.log(1)
            $(this).addClass('active').siblings().removeClass('active')
            $(this).parent().siblings().children().removeClass('active')
        })
        $('.holiday-header a').click(function () {
            $(this).addClass('active').siblings().removeClass('active')
        })

        function myChart6_1() {
            var myChart = echarts.init(document.getElementById('chart6-1'));
            var data = [80, 78, 70, 66, 54, 43, 32, 30, 28, 26]
            var titlename = ['食品卫生', '清洁卫生', '门票物价', '旅游交通', '客流状况', '景区管理', '景点景色', '服务水平', '服务设施', '厕所'];
            var valdata = [368, 328, 302, 289, 265, 243, 232, 216, 200, 180]
            // var myColor = ['#1089E7', '#F57474', '#56D0E3', '#F8B448', '#8B78F6'];
            option = {
                grid: {
                    left: '20%',
                    top: '6%',
                    right: '16%',
                    bottom: '0%'
                },
                xAxis: {
                    show: false
                },
                yAxis: [{
                    show: true,
                    data: titlename,
                    inverse: true,
                    axisLine: {
                        show: false
                    },
                    splitLine: {
                        show: false
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        color: '#ccc',
                        fontSize: 12,
                        formatter: function (value, index) {

                            return value

                        },

                    },


                }, {
                    show: true,
                    inverse: true,
                    data: valdata,
                    axisLabel: {
                        textStyle: {
                            fontSize: 12,
                            color: '#ccc',

                        },
                        formatter: function (params, value) {

                            return '\xa0\xa0' + '{e|' + data[value] + '%}'

                        },
                        rich: {
                            e: {
                                color: '#E15D68',

                            }
                        }
                    },
                    axisLine: {
                        show: false
                    },
                    splitLine: {
                        show: false
                    },
                    axisTick: {
                        show: false
                    },

                }],
                series: [{
                    name: '条',
                    type: 'bar',
                    yAxisIndex: 0,
                    data: data,
                    barWidth: 14,
                    itemStyle: {
                        normal: {
                            barBorderRadius: 7,
                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                offset: 0,
                                color: '#407FFF'

                            }, {
                                offset: 1,
                                color: '#14C6CA'

                            }]),
                        }
                    },
                    label: {
                        normal: {
                            show: false,
                            position: 'inside',
                            formatter: '{c}%',
                            labelStyle: {
                                color: '#fff',
                                fontSize: 12
                            }
                        }
                    },
                }, {
                    name: '框',
                    type: 'bar',
                    yAxisIndex: 1,
                    barGap: '-100%',
                    data: [100, 100, 100, 100, 100, 100, 100, 100, 100, 100],
                    barWidth: 14,
                    itemStyle: {
                        normal: {
                            color: 'rgba(255,255,255,.2)',
                            borderWidth: 0,
                            barBorderRadius: 7,
                        }
                    }
                }, ]
            };

            myChart.setOption(option);

        }
        myChart6_1()
    </script>
</body>

</html>